
@for $i from 0 through 30 {
  .m-#{$i} {
    margin: ($i)+px;
  }
  .m-t-#{$i} {
    margin-top: ($i)+px;
  }
  .m-b-#{$i} {
    margin-bottom: ($i)+px;
  }
  .m-l-#{$i} {
    margin-left: ($i)+px;
  }
  .m-r-#{$i} {
    margin-right: ($i)+px;
  }

  .p-#{$i} {
    padding: ($i)+px;
  }
  .p-t-#{$i} {
    padding-top: ($i)+px;
  }
  .p-b-#{$i} {
    padding-bottom: ($i)+px;
  }
  .p-l-#{$i} {
    padding-left: ($i)+px;
  }
  .p-r-#{$i} {
    padding-right: ($i)+px;
  }

  .fz-#{$i} {
    font-size: ($i)+px;
  }
}

@for $i from 0 through 200 {
  .w#{$i} {
    width: ($i)+px;
  }
  .h#{$i} {
    height: ($i)+px;
  }
  .lh#{$i} {
    line-height: ($i)+px;
  }
}


@for $i from 0 through 30 {
  .b-radius-#{$i} {
    border-radius: ($i)+px;
  }
}


.hello {
  color: red;
}
